<!--
 * @Description: 
 * @Author: 赵升华
 * @Date: 2019-09-02 09:15:06
 * @LastEditors: 赵升华
 * @LastEditTime: 2019-09-02 10:27:50
 -->
<template>
  <div id="app">
    <transition name="router-fade" mode="out-in">
			<keep-alive>
			    <router-view v-if="$route.meta.keepAlive"></router-view>
			</keep-alive>
    </transition>
    <transition name="router-fade" mode="out-in">
			<router-view v-if="!$route.meta.keepAlive"></router-view>
		</transition>
  </div>
</template>

<script>
export default {
  name: 'app',
  mounted(){
    console.log(this.$route);
  }
}
</script>

<style lang="less">
@import '~vux/src/styles/reset.less';
@import '~vux/src/styles/1px.less';

body {
  background-color: #fff;
  font-family: "PingFang SC","Helvetica Neue", Helvetica, Arial,  "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
  max-width: 10rem;
  margin: 0 auto;
  position: relative;
}

.router-fade-enter-active, .router-fade-leave-active {
    transition: opacity .3s;
}
.router-fade-enter, .router-fade-leave-active {
    opacity: 0;
}

</style>
